﻿<!doctype html>
<html>
<head>
    <meta charset="utf-8">

    <title>json封装多个样式修改</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            list-style: none;
            font-family: "微软雅黑", "张海山锐线体简"
        }

        #div1 {
            width: 100px;
            height: 100px;
            background: red;
        }
    </style>
    <script>

        window.onload = function () {
            var oDiv = document.getElementById('div1');
            /*setStyle(oDiv,'width','300px');
             setStyle(oDiv,'height','20px');
             setStyle(oDiv,'background','green');*/
            setStyle(oDiv, {width: '1000px', height: '50px', background: 'yellow'});
            function setStyle(obj, json) {
                //var json={width:'300px',height:'20px',background:'green'}
                for (var key in json) {
                    obj.style[key] = json[key];
                }
                //obj.style['background']=value;
            }
        };
    </script>
</head>

<body>

<div id="div1"></div>

</body>
</html>
